<template>
  <div class="issue">
    <JeButton v-if="isShow" type="text" class="issue-btn" style="color: #fff" @click="doShowWin">
      <i class="jeicon jeicon-from"></i>问题反馈
    </JeButton>
    <!-- <JeButton type="text" @click="doShowWin"> <i class="jeicon jeicon-from"></i>问题反馈 </JeButton> -->
  </div>
</template>
<script>
  import { defineComponent, onMounted, ref } from 'vue';

  import { Button } from '@jecloud/ui';

  import { useMicroStore } from '@common/store/micro-store';

  import { showIssueWin } from '@/hooks/useIssue';

  import { cookie } from '@jecloud/utils';

  export default defineComponent({
    name: 'Issue',
    components: {
      JeButton: Button,
    },
    setup() {
      // 集成代码
      const doShowWin = () => {
        showIssueWin({}, () => {});
      };
      // 获取子应用store
      const microStore = useMicroStore();

      const isShow = ref(false);
      // 已登录
      microStore.on('admin-login-success', () => {
        isShow.value = true;
      });
      // 是否有token
      const hasToken = () => {
        return cookie.get('authorization');
      };
      onMounted(() => {
        hasToken() ? (isShow.value = true) : (isShow.value = false);
      });
      // 退出
      microStore.on('admin-logout', () => {
        isShow.value = false;
      });

      // 注册事件
      microStore.on('issue-init', ({ id }, fn) => {
        // ...业务逻辑
        showIssueWin({ id }, fn);
      });

      return { doShowWin, isShow };
    },
  });
</script>

<style lang="less" scoped>
  .issue {
    position: relative;
    margin: 0 auto;
    padding-top: 250px;
    background: #fff;
    :deep(.issue-btn) {
      position: fixed;
      top: 13px;
      right: 140px;
    }
  }
</style>
